// 字体
@for $i from 10 through 100{
    .fs#{$i} {
			font-size: #{$i}rpx;
    }
}
// 颜色
@for $i from 0 through 9{
    .color#{$i} {
			color: ##{$i}#{$i}#{$i};
    }
}
// padding
@for $i from 1 through 100{
    .p#{$i} {
			padding: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .ptb#{$i} {
			padding-top: #{$i}rpx ;
			padding-bottom: #{$i}rpx ;
    }
}
@for $i from 1 through 100{
    .plr#{$i} {
			padding-left: #{$i}rpx;
			padding-right: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .pt#{$i} {
			padding-top: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .pl#{$i} {
			padding-left: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .pr#{$i} {
			padding-right: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .pb#{$i} {
			padding-bottom: #{$i}rpx;
    }
}
// margin
@for $i from 1 through 100{
    .m#{$i} {
			margin: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .mtb#{$i} {
			margin-top: #{$i}rpx ;
			margin-bottom: #{$i}rpx ;
    }
}
@for $i from 1 through 100{
    .mlr#{$i} {
			margin-left: #{$i}rpx;
			margin-right: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .mt#{$i} {
			margin-top: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .ml#{$i} {
			margin-left: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .mr#{$i} {
			margin-right: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .mb#{$i} {
			margin-bottom: #{$i}rpx;
    }
}
// 圆角
@for $i from 0 through 100{
    .radius#{$i} {
			border-radius: #{$i}rpx;
    }
}
// padding 左右+width自动计算
@for $i from 10 through 50{
    .w-calc-#{$i} {
			width: calc(100% - #{$i*2}rpx);
			padding-left:  #{$i}rpx;
			padding-right:  #{$i}rpx;
    }
}

// gap
@for $i from 10 through 50{
	.gap#{$i} {
		gap: #{$i}rpx;
	}
}

// grid
@for $i from 1 through 10{
	.grid-#{$i} {
		display: grid;
		grid-template-columns: repeat(#{$i}, 1fr);
	}
}
